let form = layui.form;
let layer = layui.layer;


const query = {
  pagenum: 1, // 是	int	页码值
  pagesize: 2, // 是	int	每页显示多少条数据
  cate_id: "", // "" 所有的文章分类 否	string	文章分类的 Id
  state: "", // "" 所有状态 文章状态  可选值有：已发布、草稿
}


// ==============文章列表============

getArtList()
function getArtList() {
  axios.get(`/my/article/list`,{params:query}).then(({data:{data,status,message,total}})=>{
    // console.log(res);
    let newArr =data.map(item=>{
     const{title,cate_name,pub_date,state,Id}=item
     return`
     <tr>
              <td>${title}</td>
              <td>${cate_name}</td>
              <td>${pub_date}</td>
              <td>${state}</td>
              <td>
                <button type="button" class="layui-btn layui-btn-xs btn_edit" data-id=${Id}>编辑</button>
                <button type="button" class="layui-btn layui-btn-danger layui-btn-xs btn_delete" data-id=${Id}>删除</button>
              </td>
            </tr>
     `
    }).join(``)
    $(`#list`).html(newArr)
    renderPage(total)
  })
}



//===================================获取文章分类的下拉菜单================================

axios.get(`/my/article/cates`).then(({data:{data,message,status}})=>{
 
  let newArr=data.map(item=>{
    const{Id,name}=item
   return`
   <option value="${Id}">${name}</option>
   `
  }).join(``)

  $(`#cateSelect`).append(newArr)
  form.render('select');
})

//===================================实现筛选功能================================
$(`#form`).on(`submit`,function (e) {
  e.preventDefault()
  const data=$(this).serialize()
  
  query.cate_id=$(`#cateSelect`).val()

  query.state=$(`#stateSelect`).val()

  query.pagenum=1

  getArtList()

})

let laypage=layui.laypage


function renderPage(total) {
  laypage.render({
    elem: 'page-box' ,//注意，这里的 test1 是 ID，不用加 # 号
    count: total, //数据总数，从服务端得到
    limit:query.pagesize,
    curr:query.pagenum,
    limits:[2,3,5,8,10],
    layout:[`count`,`limit`,'prev', 'page', 'next',`skip`],
    jump: function(obj, first){
      //obj包含了当前分页的所有参数，比如：
      //  console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
      // console.log(obj.limit); //得到每页显示的条数
      query.pagenum=obj.curr
      query.pagesize=obj.limit
      //首次不执行
      if(!first){
        //do something
        getArtList()
      }
    }
  });
 
}

//===================================删除功能================================

$(`#list`).on(`click`,`.btn_delete`,function () {
  let id=$(this).attr(`data-id`)
  layer.confirm('确认删除此文章吗?', {icon: 3, title:'提示'}, function(index){

  axios.get(`/my/article/delete/${id}`).then(({data:{status,message}})=>{
    // console.log(res);
    if (status!==0) {
      return layer.msg(message)
    }
    
    if ($(`.btn_delete`.length===1)) {
      if (query.pagenum===1) {
        query.pagenum=1
      }else{
        query.pagenum=query.pagenum-1
      }

    } 
    layer.msg(message)
    layer.close(index)
    getArtList()
  })
  })
})



//===================================编辑功能================================

$(`#list`).on(`click`,`.btn_edit`,function () {
  let id=$(this).attr(`data-id`)

  // location.href =`/article/art-edit.html?id=${id}`
  location.href =`/article/art_edit.html?id=${id}`
})